import { modelHTML } from "./constant";

import { selectHightlightShow } from "./select";
import { checkProtectionAuthorityNormal } from "./protection";
import { replaceHtml, chatatABC } from "../utils/util";
import { rowlenByRange } from "../global/getRowlen";
import { isEditMode } from "../global/validate";
import cleargridelement from "../global/cleargridelement";
import { jfrefreshgrid } from "../global/refresh";
import { getcellvalue } from "../global/getdata";
import { orderbydata, sortColumnSeletion } from "../global/sort";
import tooltip from "../global/tooltip";
import editor from "../global/editor";
import { isdatatype } from "../global/datecontroll";
import Store from "../store";
import locale from "../locale/locale";

export function orderByInitial() {
  const _locale = locale();
  //菜单栏 排序按钮
  $("#luckysheetorderbyasc, #luckysheetorderbyasc_t").mousedown(function(
    event
  ) {
    cleargridelement(event);
    sortColumnSeletion(Store.orderbyindex, true);
    selectHightlightShow();
  });

  $("#luckysheetorderbydesc, #luckysheetorderbydesc_t").click(function(event) {
    cleargridelement(event);
    sortColumnSeletion(Store.orderbyindex, false);
    selectHightlightShow();
  });

  //排序事件
  let luckysheet_sort_initial = true;
  $("#luckysheetorderby").click(function() {
    if (!checkProtectionAuthorityNormal(Store.currentSheetIndex, "sort")) {
      return;
    }

    $("body .luckysheet-cols-menu").hide();
    const locale_sort = _locale.sort;
    if (Store.luckysheet_select_save.length > 1) {
      if (isEditMode()) {
        alert(locale_sort.noRangeError);
      } else {
        tooltip.info(locale_sort.noRangeError, "");
      }
      return;
    }

    let last = Store.luckysheet_select_save[0];
    let r1 = last["row"][0],
      r2 = last["row"][1];
    let c1 = last["column"][0],
      c2 = last["column"][1];

    if (luckysheet_sort_initial) {
      luckysheet_sort_initial = false;

      let content = `<div style="overflow: hidden;" class="luckysheet-sort-modal"><div><label><input type="checkbox" id="luckysheet-sort-haveheader"/><span>${locale_sort.hasTitle}</span></label></div><div style="overflow-y:auto;" id="luckysheet-sort-dialog-tablec"><table data-itemcount="0" cellspacing="0"> <tr><td>${locale_sort.hasTitle} <select name="sort_0"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> </td> <td> <div><label><input value="asc" type="radio" checked="checked" name="sort_0"><span>${locale_sort.asc}A-Z</span></label></div> <div><label><input value="desc" type="radio" name="sort_0"><span>${locale_sort.desc}Z-A</span></label></div></td></tr></table></div><div style="background: #e5e5e5;border-top: 1px solid #f5f5f5; height: 1px; width: 100%;margin:2px 0px;margin-bottom:10px;"></div> <div> <span style="font-weight: bold; text-decoration: underline;text-align:center;color: blue;cursor: pointer;" class="luckysheet-sort-dialog-additem">+ ${locale_sort.addOthers}</span> </div> </div>`;

      $("body").append(
        replaceHtml(modelHTML, {
          id: "luckysheet-sort-dialog",
          addclass: "",
          title: _locale.sort.sortTitle,
          content: content,
          botton: `<button id="luckysheet-sort-modal-confirm" class="btn btn-primary">${locale_sort.confirm}</button><button class="btn btn-default luckysheet-model-close-btn">${locale_sort.close}</button>`,
        })
      );

      $("#luckysheet-sort-dialog .luckysheet-sort-dialog-additem").click(
        function() {
          let last = Store.luckysheet_select_save[0];
          let r1 = last["row"][0],
            r2 = last["row"][1];
          let c1 = last["column"][0],
            c2 = last["column"][1];

          let option = "",
            i = $("#luckysheet-sort-dialog table").data("itemcount") + 1;
          let t = $("#luckysheet-sort-haveheader").is(":checked");

          for (let c = c1; c <= c2; c++) {
            if (t) {
              let v = getcellvalue(r1, c, Store.flowdata, "m");

              if (v == null) {
                v = locale_sort.columnOperation + (c - c1 + 1);
              }

              option += '<option value="' + c + '">' + v + "</option>";
            } else {
              option +=
                '<option value="' + c + '">' + chatatABC(c) + "</option>";
            }
          }

          $("#luckysheet-sort-dialog table").append(`
                    <tr class="luckysheet-sort-dialog-tr">
                        <td><span class="luckysheet-sort-item-close" onclick="$(this).parent().parent().remove();"><i class="fa fa-times"
                                    aria-hidden="true"></i></span>${locale_sort.secondaryTitle} <select
                                name="sort_${i}">${option}</select> </td>
                        <td>
                            <div><label><input value="asc" type="radio" checked="checked"
                                        name="sort_${i}"><span>${locale_sort.asc}A-Z</span></label></div>
                            <div><label><input value="desc" type="radio" name="sort_${i}"><span>${locale_sort.desc}Z-A</span></label>
                            </div>
                        </td>
                    </tr>
                `);
          $("#luckysheet-sort-dialog table").data("itemcount", i);
        }
      );

      $("#luckysheet-sort-haveheader").change(function() {
        let last = Store.luckysheet_select_save[0];
        let r1 = last["row"][0],
          r2 = last["row"][1];
        let c1 = last["column"][0],
          c2 = last["column"][1];

        let t = $(this).is(":checked");
        let option = "";

        for (let c = c1; c <= c2; c++) {
          if (t) {
            let v = getcellvalue(r1, c, Store.flowdata, "m");

            if (v == null) {
              v = locale_sort.columnOperation + (c - c1 + 1);
            }

            option += '<option value="' + c + '">' + v + "</option>";
          } else {
            option += '<option value="' + c + '">' + chatatABC(c) + "</option>";
          }
        }

        $("#luckysheet-sort-dialog tr select").each(function() {
          $(this).html(option);
        });
      });

      //Custom sort
      $("#luckysheet-sort-modal-confirm").click(function() {
        if (Store.luckysheet_select_save.length > 1) {
          if (isEditMode()) {
            alert(locale_sort.noRangeError);
          } else {
            tooltip.info(locale_sort.noRangeError, "");
          }

          return;
        }

        let d = editor.deepCopyFlowData(Store.flowdata);

        let last = Store.luckysheet_select_save[0];
        let r1 = last["row"][0],
          r2 = last["row"][1];
        let c1 = last["column"][0],
          c2 = last["column"][1];

        //Data has header row
        let t = $("#luckysheet-sort-haveheader").is(":checked");

        let str;
        if (t) {
          str = r1 + 1;
        } else {
          str = r1;
        }

        let hasMc = false; //Whether the sort selection has merged cells

        let data = [];

        for (let r = str; r <= r2; r++) {
          let data_row = [];

          for (let c = c1; c <= c2; c++) {
            if (d[r][c] != null && d[r][c].mc != null) {
              hasMc = true;
              break;
            }

            data_row.push(d[r][c]);
          }

          data.push(data_row);
        }

        if (hasMc) {
          if (isEditMode()) {
            alert(locale_sort.mergeError);
          } else {
            tooltip.info(locale_sort.mergeError, "");
          }

          return;
        }

        $(
          $("#luckysheet-sort-dialog table tr")
            .toArray()
            .reverse()
        ).each(function() {
          let i = $(this)
              .find("select")
              .val(),
            asc = $(this)
              .find("input:radio:checked")
              .val();

          i -= c1;

          if (asc == "asc") {
            asc = true;
          } else {
            asc = false;
          }

          data = orderbydata([].concat(data), i, asc);
        });

        for (let r = str; r <= r2; r++) {
          for (let c = c1; c <= c2; c++) {
            d[r][c] = data[r - str][c - c1];
          }
        }

        let allParam = {};
        if (Store.config["rowlen"] != null) {
          let cfg = $.extend(true, {}, Store.config);
          cfg = rowlenByRange(d, str, r2, cfg);

          allParam = {
            cfg: cfg,
            RowlChange: true,
          };
        }

        jfrefreshgrid(d, [{ row: [str, r2], column: [c1, c2] }], allParam);

        $("#luckysheet-sort-dialog").hide();
        $("#luckysheet-modal-dialog-mask").hide();
      });
    }

    let option = "";
    for (let c = c1; c <= c2; c++) {
      option += '<option value="' + c + '">' + chatatABC(c) + "</option>";
    }

    $("#luckysheet-sort-dialog select").html(option);

    $("#luckysheet-sort-dialog .luckysheet-sort-dialog-tr").remove();

    $("#luckysheet-sort-haveheader").prop("checked", false);
    $("#luckysheet-sort-dialog input:radio:first").prop("checked", "checked");

    $("#luckysheet-sort-dialog .luckysheet-modal-dialog-title-text").html(
      locale_sort.sortRangeTitle +
        "<span>" +
        chatatABC(c1) +
        (r1 + 1) +
        "</span>" +
        locale_sort.sortRangeTitleTo +
        "<span>" +
        chatatABC(c2) +
        (r2 + 1) +
        "</span>"
    );

    let $t = $("#luckysheet-sort-dialog"),
      myh = $t.outerHeight(),
      myw = $t.outerWidth();
    let winw = $(window).width(),
      winh = $(window).height();
    let scrollLeft = $(document).scrollLeft(),
      scrollTop = $(document).scrollTop();

    $("#luckysheet-sort-dialog-tablec").css("max-height", (winh - myh) / 2);
    $("#luckysheet-sort-dialog")
      .css({
        left: (winw + scrollLeft - myw) / 2,
        top: (winh + scrollTop - myh) / 2,
      })
      .show();
    $("#luckysheet-modal-dialog-mask").show();

    if (r1 < r2) {
      setTimeout(function() {
        let flowrowdata1 = Store.flowdata[r1],
          flowrowdata2 = Store.flowdata[r1 + 1],
          hastitle = false;

        for (let i = c1; i <= c2; i++) {
          let isdatatype_r1 = isdatatype(flowrowdata1[i]),
            isdatatype_r2 = isdatatype(flowrowdata2[i]);

          if (isdatatype_r1 != isdatatype_r2) {
            hastitle = true;
          }
        }

        if (hastitle) {
          $("#luckysheet-sort-haveheader")
            .prop("checked", true)
            .change();
        }
      }, 10);
    }
  });
}
